<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>有道写作</title>
    <link rel="shortcut icon" href="https://ydschool-video.nosdn.127.net/15928130836361592813083636favicon_32.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/reset.css" />
    <link rel="stylesheet" href="./css/xiezuo.css" />
    <style>
      h1 {
        margin-block-start: 0.67em;
        margin-block-end: 0.67em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
      }
      h2 {
        display: block;
        font-size: 1.5em;
        margin-block-start: 0.83em;
        margin-block-end: 0.83em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
        font-weight: bold;
      }
      h3 {
        display: block;
        font-size: 1.17em;
        margin-block-start: 1em;
        margin-block-end: 1em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
        font-weight: bold;
      }
      h5 {
        display: block;
        font-size: 0.83em;
        margin-block-start: 1.67em;
        margin-block-end: 1.67em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
        font-weight: bold;
      }
      .lp {
        background: #fff;
        box-shadow: 0 20px 60px rgb(48 58 110 / 10%);
        border-radius: 18px;
      }
      p {
        margin-block-start: 1em;
        margin-block-end: 1em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
      }
      .wrap {
        position: relative;
      }
      img {
        border: 0;
      }
    </style>
  </head>

  <body>
    <!-- 导航条 -->
    <header style="box-shadow: rgb(0 0 0 / 4%) 0px 2px 16px 0px, rgb(0 0 0 / 6%) 0px -1px 0px 0px">
      <div class="conter">
        <div class="logo">
          <img src="./img/12_logo.png" alt="" />
          <h1>有道写作</h1>
        </div>
        <div class="xd">
          <div><a href="#">下载</a></div>
          <div><a href="#">登录</a></div>
        </div>
      </div>
    </header>
    <!-- 第二层 -->
    <div class="banner">
      <!-- 版心 -->
      <div class="conter">
        <h1>英文写作<br />从未如此简单</h1>
        <p class="underline">有道写作帮助你精准解析文章的拼写、语法、样式、用词等不足，智能修改，实现完美英文写作。</p>
        <a href="#" class="yjty">一键体验</a>
        <p class="yyzh">已有帐号？<a href="#">去登录</a></p>
      </div>
    </div>
    <!-- 第三层 -->
    <div class="video">
      <div class="bj"></div>
      <div class="content">
        <div class="video-mask">
          <video src=""></video>
          <div class="video-end"></div>
        </div>
      </div>
    </div>
    <!-- 第四层 -->
    <div class="cinter">
      <div class="wrap warp-1">
        <!-- 左边 -->
        <div class="lf">
          <h2>01</h2>
          <h3>智能识别200种错误类型</h3>
          <p>拼写 | 语法 | 标点符号 | 词级润色等</p>
          <p>强大算法全面纠错，一键完成文章优化</p>
        </div>
        <!-- 右边 -->
        <div class="rg">
          <div class="lp">
            <video src=""></video>
            <div></div>
          </div>
        </div>
      </div>
      <div class="wrap warp-2">
        <!-- 左边 -->
        <div class="lf">
          <div class="con">
            <ul>
              <li class="label-01 label">语法</li>
              <li class="label-02 label">内容</li>
              <li class="label-03 label">词汇</li>
              <li class="label-04 label"></li>
              <li class="label-05 label">结构</li>
            </ul>
          </div>
        </div>
        <!-- 右边 -->
        <div class="rg">
          <h2>02</h2>
          <h3>多维度科学评析</h3>
          <p>词汇 | 结构 | 语法 | 内容</p>
          <p>依据作文类型综合打分，全面解析文章优劣</p>
          <p>目前仅限手机App内使用</p>
        </div>
      </div>
      <div class="wrap warp-3">
        <!-- 左边 -->
        <div class="lf">
          <h2>03</h2>
          <h3>写作方式灵活自由</h3>
          <p>支持即时编辑或上传批改，满足各种使用场景</p>
        </div>
        <!-- 右边 -->
        <div class="rg">
          <ul>
            <li>
              <img class="icon" src="./img/1592465423.png" alt="" />
              <h5>在线写作</h5>
              <p>在线写作，简单便捷</p>
              <img class="checked" src="./img/15922991632495.png" alt="" />
            </li>
            <li>
              <img class="icon" src="./img/1592465454456.png" alt="" />
              <h5>文档上传</h5>
              <p>上传论文写传, 一键批改</p>
              <img class="checked" src="./img/15922991632495.png" alt="" />
              <p>稍后推出</p>
            </li>
            <li>
              <img class="icon" src="./img/1592465666.png" alt="" />
              <h5>拍照上传</h5>
              <p>手写作文拍照后即可批改，省心</p>
              <img class="checked" src="./img/15922991632495.png" alt="" />
              <p>目前仅限手机App内使用</p>
            </li>
          </ul>
        </div>
      </div>
      <div class="wrap warp-4">
        <!-- 左边 -->
        <div class="lf">
          <video src=""></video>
        </div>
        <!-- 右边 -->
        <div class="rg">
          <h2>04</h2>
          <h3>批改中随时翻译对照</h3>
          <p>批改中，随时可以对批改后的结果进行翻译，做到心中有数</p>
        </div>
      </div>
      <div class="wrap warp-5">
        <!-- 标题 -->
        <div class="sc">
          <h2>05</h2>
          <h3>满足更多场景</h3>
        </div>
        <!-- 图片 -->
        <div class="xc">
          <div class="item">
            <img src="./img/159246334138001.png" alt="" />
            <div class="item-title">
              <p>作文批改、点评</p>
              <a href="#">下载APP</a>
            </div>
          </div>
          <div class="item">
            <img src="./img/1592463339002.png" alt="" />
            <div class="item-title">
              <p>邮件沟通、聊天、更新社交媒体</p>
              <a href="#">免费获取浏览器扩展</a>
            </div>
          </div>
          <div class="item">
            <img src="./img/1592463340431159246003.png" alt="" />
            <div class="item-title">
              <p>写文章、写论文</p>
              <a href="#">免费获取Word加载项</a>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 页脚 -->
    <div class="foot">
      <!-- 版心 -->
      <div class="ct">
        <h1>智能修改, 实现完美英文写作</h1>
        <h5>成就更优秀的你</h5>
        <a href="">免费体验</a>
        <div class="footer">
          <div class="row01">
            <img src="./img/159229916963logo.png" alt="" />
            <div class="tlt">
              <a href="#" class="i">联系我们</a>
              <a href="#" class="i">服务条款</a>
              <a href="#" class="i">隐私政策</a>
            </div>
          </div>
          <div class="row02">
            <div>© 2021 网易公司 京ICP备080268号</div>
            <div>
              违法和不良信息举报电话：400-900-4163（涉未成年人） 举报邮箱：
              <a href="#">youdao_jubao@rd.netease.com</a>
              （涉未成年人）&nbsp;&nbsp;&nbsp;&nbsp;
              <a href="#">网上有害信息举报专区</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>
